/*
 * @Description: 结算方式过滤面板
 * @Author: iamsmiling
 * @Date: 2021-06-09 17:45:58
 * @LastEditTime: 2021-06-09 20:33:23
 */
import 'dart:ui';

import 'package:credit_business_circle/R/R.dart';
import 'package:credit_business_circle/domain/local/filter_option/settlement_mode_entity.dart';
import 'package:flutter/material.dart';

class SettlementFilterFragment extends StatefulWidget {
  final List<SettlementModeEntity> options;
  final int intialIndex;
  const SettlementFilterFragment(
      {Key? key, required this.options, this.intialIndex = 0})
      : super(key: key);

  @override
  _SettlementFilterFragmentState createState() =>
      _SettlementFilterFragmentState();
}

class _SettlementFilterFragmentState extends State<SettlementFilterFragment> {
  late int index;

  @override
  void initState() {
    index = widget.intialIndex;
    super.initState();
  }

  void select(SettlementModeEntity o) {
    setState(() {
      index = widget.options.indexOf(o);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      width: R.dimen.width * .8,
      child: Scaffold(
        backgroundColor: R.color.ffffffff,
        appBar: AppBar(
          backgroundColor: R.color.ffffffff,
          leadingWidth: R.dimen.width,
          leading: Container(
            margin: EdgeInsets.only(left: R.dimen.dp20),
            child: Text(
              "选择结算方式",
              style: TextStyle(
                  fontSize: R.dimen.sp13,
                  color: R.color.ff333333,
                  fontWeight: FontWeight.w500),
            ),
          ),
          elevation: 0,
        ),
        body: Container(
          margin: EdgeInsets.only(left: R.dimen.dp20),
          child: Wrap(
            spacing: R.dimen.dp10,
            runSpacing: R.dimen.dp14,
            children: [
              for (SettlementModeEntity o in widget.options)
                GestureDetector(
                  onTap: () => select(o),
                  child: Container(
                    padding: EdgeInsets.symmetric(vertical: R.dimen.dp12),
                    alignment: Alignment.center,
                    width: (R.dimen.width * .8 -
                            R.dimen.dp20 * 2 -
                            R.dimen.dp10 * 2) /
                        3.0001,
                    decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(R.dimen.sp3),
                        color: index == widget.options.indexOf(o)
                            ? R.color.ff30bb92
                            : R.color.fff5f5f5),
                    child: Text(
                      o.label,
                      style: TextStyle(
                          fontSize: R.dimen.sp12,
                          color: index == widget.options.indexOf(o)
                              ? R.color.ffffffff
                              : R.color.ff2e2e2e),
                    ),
                  ),
                )
            ],
          ),
        ),
        bottomNavigationBar: Container(
          decoration: BoxDecoration(
              border:
                  Border(top: BorderSide(width: .5, color: R.color.ffcccccc))),
          // height: kBottomNavigationBarHeight,
          // margin: EdgeInsets.only(bottom: Get.mediaQuery.padding.bottom),
          padding: EdgeInsets.symmetric(
              vertical: R.dimen.dp14, horizontal: R.dimen.dp24),
          child: ElevatedButtonTheme(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                ElevatedButton(
                  onPressed: () {},
                  child: Text(
                    "取消",
                    style: TextStyle(
                        fontWeight: FontWeight.w500,
                        fontSize: R.dimen.sp13,
                        color: R.color.ff777777),
                  ),
                  style: ButtonStyle(
                      backgroundColor:
                          MaterialStateProperty.all(R.color.fff5f5f5)),
                ),
                ElevatedButton(
                  onPressed: () {},
                  child: Text("确定"),
                ),
              ],
            ),
            data: ElevatedButtonThemeData(
              style: ButtonStyle(
                  elevation: MaterialStateProperty.all(0),
                  textStyle: MaterialStateProperty.all(TextStyle(
                      fontSize: R.dimen.sp13,
                      color: R.color.ffffffff,
                      fontWeight: FontWeight.w500)),
                  padding: MaterialStateProperty.all(EdgeInsets.symmetric(
                      vertical: R.dimen.dp10, horizontal: R.dimen.dp40)),
                  shape: MaterialStateProperty.all(RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(R.dimen.sp5))),
                  backgroundColor: MaterialStateProperty.all(R.color.ff00c28a)),
            ),
          ),
        ),
      ),
    );
  }
}
